{% from "includes/common_macros.html" import favicon with context %}
<!DOCTYPE html>
<html lang="{{ request.LANGUAGE_CODE }}"{% if dir %} dir="{{ dir }}"{% endif %}{% if settings.GTM_CONTAINER_ID %} data-gtm-container-id="{{ settings.GTM_CONTAINER_ID }}"{% endif %} class="no-js">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
  <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no" media="(device-height: 568px)">
  <meta name="apple-mobile-web-app-capable" content="yes" />
  <meta name="apple-mobile-web-app-status-bar-style" content="black" />

  <title>{{ title }} | {{ pgettext('site_title', 'Mozilla Support') }}</title>

  {{ favicon() }}

  <link rel="search" type="application/opensearchdescription+xml" title="{{ _('Mozilla Support') }}" href="{{ url('search.plugin') }}"/>

  {% for style in styles %}
    {% stylesheet style %}
  {% endfor %}
  {% if meta %}
    {% for tag in meta %}
      <meta name="{{ tag[0] }}" content="{{ tag[1] }}"/>
    {% endfor %}
  {% endif %}
  {% if canonical_url %}
    <link rel="canonical" href="{{ canonical_url }}" />
  {% endif %}

  {% block head %}
  {% endblock %}

  {% include "includes/google-analytics.html" %}
</head>
<body class="{{ classes }} minimal"
      data-readonly="{{ settings.READ_ONLY|json }}"
      data-static-url="{{ STATIC_URL }}"
      data-orientation="{% if page_align %}{{ page_align }}{% else %}right{% endif %}"
      {% if ga_alternate_url %}
        data-ga-alternate-url="{{ ga_alternate_url }}"
      {% endif %}
      data-usernames-api="{{ url('users.api.usernames') }}"
{% if extra_body_attrs -%}
  {% for attr, val in extra_body_attrs.items() %}{{ attr }}="{{ val }}" {% endfor %}
{%- endif %}>

{% block after_header %}{% endblock %}

<div class="wrapper slide-on-exposed">
  <section id="content">
    {% block content %}{% endblock %}
  </section>

  <footer>
    {% block footer %}{% endblock %}
  </footer>
</div>

{% block after_main %}{% endblock %}

{# TODO: The JS url changes whenever our js code changes.
   But this should get cached busted whenever a locale is updated.
   It's complicatred to fix. But for now it isn't more broken than
   before. #}
{% if request.LANGUAGE_CODE %}
 <script src="{{ static('jsi18n/{lang}/djangojs.js'|f(lang=request.LANGUAGE_CODE|lower)) }}"></script>
{% endif %}

{% for script in scripts %}
  {% javascript script %}
{% endfor %}

</body>
</html>
